html,body, .section {
    min-height: 600px;
    min-width: 1200px;
    /* 最小宽高 方式缩放过于变形 */
} 


/* 第一屏制作 */ 
.fly {
    position: absolute;
    right: 20%;
    top: 10%;
}

.shafa1 {
    position: absolute;
    left: 50%;
    margin-left: -200px;
    bottom: 335px;
}

.goods {
    position: absolute;
    left: 50%;
    margin-left: -400px;
    bottom: 150px;
}

.section1 {
    background: #fadd67 url(../images/t1fpyqfltdxxaiulhh-990-600.png) no-repeat center bottom;
}

/* 第二屏制作 */
.section2 {
    background: #84a2d4 url(../images/t1zdgpfi8exxca6rfn-2000-600.png) no-repeat center bottom;
    /* 因为层级关系 后面屏3会压住屏2  所以提高屏2的权重 */
    z-index: 2;
}

.computer {
    width: 990px;
    height: 500px;
    position: absolute;
    left: 50%;
    /* margin-left: -495px; */
    transform: translateX(-50%);
    bottom: 0;
    /* background-color: tan;
   opacity: 0.5; */
}

.search {
    width: 222px;
    height: 45px;
    background: url(../images/search.png) no-repeat;
    right: -30px;
    bottom: 300px;
    position: absolute;
    /* 先隐藏起来  当滚动到第二屏显示 */
    display: none;
}

.search-words {
    position: absolute;
    right: 35px;
    top: 5px;
    /* 淡入淡出 使用透明度   */
    opacity: 0;
}

.search-tiao {
    position: absolute;
    bottom: 300px;
    right: 380px;
    display: none;
}

.shafas {
    height: 100px;
    position: absolute;
    bottom: 220px;
    right: 280px;
    display: none;
}

.shafa2 {
    position: absolute;
    bottom: 350px;
    left: 380px;
    width: 100px;
    display: none;
    /* z-index: 10; */
}

.cover {
    position: absolute;
    bottom: 334px;
    right: 505px;
    width: 105px;
    height: 90px;
    background-color: #fff;
    display: none;
    /* z-index: 5; */
}

.words1,
.words2 {
    position: absolute;
    left: 50%;
    bottom: 550px;
    transform: translateX(-50%);
}

.words2 {
    opacity: 0;
}

/* 第三屏制作 */
.three {
    position: absolute;
    width: 700px;
    height: 500px;
    /* background-color: teal; */
    background: url(../images/main.png) no-repeat center center;
    left: 50%;
    transform: translateX(-50%);
    bottom: 50px
}

.select {
    position: absolute;
    width: 300px;
    height: 250px;
    bottom: 0;
    right: 10px;
    /* background-color: teal; */
}

.btn {
    position: absolute;
    bottom: 10px
}

.btn-a {
    /* 淡入效果 */
    opacity: 0;
}

.img {
    position: absolute;
    top: 0;
}

.img-a {
    /* 淡入效果 */
    opacity: 0;
}

/* .img-a,.btn-a {
    display: none
} */
/* 沙发 */
.shafa3,
.xieshafa {
    position: absolute;
    left: 115px;
    bottom: 200px;
    display: none;
  
}

.section3 {
    background: #ef674d;
    /* z-index: 1; */
}

/* 第四屏制作 */
.cloud {
    position: absolute;
    left: 50%;
    bottom: 550px;
}

.words4,
.words5 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 500px
}

.words5 {
    opacity: 0;
}

.car {
    position: absolute;
    width: 500px;
    /* background-color: teal; */
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    /* z-index: 60!important; */
}

.car-shafa {
    position: absolute;
    bottom: 200px;
    left: 50%;
    transform: translateX(-50%);
    /* 负值往下叠加 */
    z-index: -1;
    display: none;
}

.adress {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background-color: teal;
    bottom: 180px;
    display: none
}

.adress1 {
    position: absolute;
    left: 60px;
    top: 60px;
    opacity: 0;
}

.section4 {
    background: #fed url(../images/t1iresfnxaxxca6rfn-2000-600.png) no-repeat center bottom;
    z-index: -1;
}

/* 第五屏制作 */
.words6 {
    position: absolute;
    left: 20%;
    top: 15%;
    opacity: 0;
}
.card {
    position: absolute;
    left: 20%;
    bottom: 200px;
    z-index: 5;
}

.bank {
    position: absolute;
    left: 27%;
    bottom: 270px;
}

.xieshafa5 {
    position: absolute;
    bottom: 800px;
    left: 25%;
display: none;
}

.mouse {
    position: absolute;
    right: 20%;
    bottom: 200px;
}

.mouse-a {
    /* display: none; */
    opacity: 0;
}

.hand {
    position: absolute;
    right: 24%;
    bottom: -375px;
}
/* 切掉鼠标小尾巴 */
.overFlow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.section5 {
    background: #d04759 url(../images/t1yisqfa4exxa3gmkg-2000-1500.png);
    /* overflow: hidden; */
    perspective: 500;
    -webkit-perspective: 500;
    z-index: 1;
}
/* 第六屏制作 */
.box {
    position: absolute;
    left: 123px;
    bottom: 500px;
    z-index: 2;
}
.car-06 {
    position: absolute;
    bottom: 0;
     right: 50%;
     z-index: 3;
}
.cloud6 {
    position: absolute;
    left: 50%;
    bottom: 550px;
    animation:  cloud6a 50s;
}
@keyframes cloud6a {
    50% {
        left: 10%;
    }
}
.pop {
    position: absolute;
    bottom: 119px;
    right: 48%;
    display: none;
    z-index: 10 ;
}
.boy {
    position: absolute;
    bottom: 0;
    right: 50%;
    height: 100px;
}
.girl {
     right: 315px;
    bottom: 116px;
    height: 123px;
    position: absolute;
    display: none;
    z-index: 11;
}
.door {
    position: absolute;
    right: 285px;
    bottom: 116px;
    /* display: none; */
    opacity: 0;
}
.please {
    position: absolute;
    right: 445px;
    bottom: 400px;
    opacity: 0;
}
.words7 {
    position: absolute;
    left: 10%;
    bottom: 479px;
    display: none;  
}
.section6 {
    background: #84d9ed url(../images/t1dvj.fn0gxxb0_fua-2500-600.png) no-repeat 25% 100%;
}
/* 第七屏 */
.star {
    position: absolute;
    left: 50%;
    bottom: 439px;
    margin-left: -295px;
    width:0;
    height: 20px;
    background: url(../images/star.png) no-repeat;
    background-size: 97px; 
}
.good {
    position: absolute;
    bottom: 382px;
    left: 50%;
    margin-left: -289px;
    opacity: 0;
}
.section7 {
    background: #8ac060 url(../images/t1wf1tfctaxxa3gmkg-2000-1500.png) no-repeat 50% 100%;
}
/* 第八屏 */
.beginShop {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 365px;
}
.btn-08a {
    position: absolute;
    left: 0;
    top: 0;
    display: none; 
}
.once {
    position: absolute;
    bottom: 403px;
    left: 50%;
    margin-left: 240px;
    cursor: pointer;
}
.hand-08 {
    position: absolute;
    bottom: 0;
    left: 50%;
}
.section8 {
    background: url(../images/ksgw.png);
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    background: lawngreen;
}

/* 动画组 */

.fly-updown {
    animation: fly 5s linear infinite;
}

.shafa-updown {
    animation: shafa1 3s linear infinite;
}

@keyframes fly {
    0% {
        top: 10%;
    }

    50% {
        top: 20%;
    }

    100% {
        top: 10%;
    }
}

@keyframes shafa1 {
    50% {
        bottom: 360px;
    }

    100% {
        bottom: 335px;
    }
}

/* 继续往下 */
.next {
    position: fixed;
    bottom: 120px;
    right: 10%;
    /* z-index: 999; */
}

.next-updown {
    animation: next 2s linear infinite;
}

@keyframes next {
    50% {

        bottom: 100px;
    }

    100% {
        bottom: 120px;
    }
}

/* 购物中心 */
.shop {
    position: fixed;
    top: 5%;
    right: 5%;
}

/* 云第一组 */
.cloud-return {
    animation: cloud 50s linear infinite;
}

@keyframes cloud {
    0% {
        left: 50%;
    }

    50% {
        left: -30%;
    }

    100% {
        left: 50%;
    }
}
.words6-a {
    animation: words6 3s forwards;
    /* 让动画保持最后一帧状态  不循环 */
    /* animation-fill-mode: forwards; */
}

@keyframes words6 {
    100% {
        opacity: 1;
        transform: translateZ(50px) rotateY(360deg);
    }
}